<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="keywords"
          th:content="'HTML,Springboot,thymeleaf,markdown,Layui,个人博客,'+${myinfo.getWebname()}+','+${myinfo.getNickname()}"/>
    <title th:text="${myinfo.getWebname()}"></title>
    <link rel="icon" th:href="'/style/images/system/'+${myinfo.getWebicon()}">

    <!--bootstrap3-->
    <link rel="stylesheet" href="/dist/bootstrap3/css/bootstrap.min.css">
    <script src="/dist/jquery/jquery-3.4.1.min.js"></script>
    <script src="/dist/bootstrap3/js/bootstrap.min.js"></script>

    <!--font-awesome-->
    <link rel="stylesheet" href="/style/fonts/font-awesome.min.css">

    <!--自定义css-->
    <link rel="stylesheet" href="/style/css/me.css">
    <script src="/script/me.js"></script>

    <!--layui-->
    <link rel="stylesheet" href="/dist/layui/css/layui.css" media="all">
    <script src="/dist/layui/layui.js"></script>

    <!--semantic-->
    <link rel="stylesheet" href="/dist/semantic/semantic.min.css">

    <style type="text/css">
        .forget_brand {
            width: 50px;
            height: auto;
            padding: 5px;
            border-radius: 50%;
        }
    </style>
    <script language='javascript' th:inline="javascript">

    </script>
    <script type="text/javascript"></script>
</head>
<body>
<div class="m-text-a ui horizontal divider ">
    <img class="forget_brand" src="/style/images/system/avatar.jpg">
</div>

<!--正文内容-->
<div class="m-container m-padded-large">
    <div class="ui container">
        <div class="ui stackable grid">

            <div class="eleven wide column">
                <h2>重要提示！！！ </h2>
                <h3>本站仅限正常使用可以用于接收邮件的邮箱进行注册和密码找回</h3>
                <label>本站仅作为学习交流使用，未经许可不得用于任何商业目的。<br/>
                    如果您忘记了邮箱和登录帐号，也可以联系管理员协助找回密码。<br/>
                    请勿多次提交，否则会被系统认定为恶意攻击而进行IP封禁。
                </label>
            </div>
            <div class="five wide column">
                <div class="ui segments">
                    <div class="ui secondary segment">
                        <div class="ui column grid">
                            <div class="center column">
                                <i class="idea icon"></i>重置密码
                            </div>
                        </div>
                    </div>
                    <div class="ui red segment">

                        <label>帐号</label><br/>
                        <div class="ui input">
                            <input type="text" class="layui-input" name="account" id="account" th:value="${account}"
                                   readonly>
                        </div>
                        <br/><label>新密码</label><br/>
                        <div class="ui input">
                            <input type="password" class="layui-input" maxlength="16" name="password" id="password"
                                   lay-verify="password" placeholder="请输入新密码">
                        </div>

                        <br/><label>确认新密码</label><br/>
                        <div class="ui input">
                            <input type="password" class="layui-input" maxlength="16" name="passwordconf"
                                   id="passwordconf" lay-verify="password"
                                   placeholder="请再次输入新密码">
                        </div>

                        <br/>
                        <br/>
                        <button class="layui-btn layui-btn-fluid" id="send_confirm_btn" onclick="resetpwd()">立即修改
                        </button>
                        <input type="text" class="layui-input" name="token" id="token" th:value="${token}" readonly
                               hidden>
                    </div>
                </div>

                <div class="ui">
                    已经想起来密码了? <a href="/user/login" style="font-weight: bold">尝试登录</a></div>
            </div>
        </div>
    </div>
</div>
<!--正文内容结束-->
<!--底部内容-->
<footer class="ui inverted vertical segment m-padded-large">
    <div class="ui center aligned container">
        <div class="ui inverted divided stackable grid">
            <div class="four wide column">
                <div class="ui inverted link list">
                    <div class="item">
                        <img src="/style/images/system/wx.jpg" class="ui rounded image" alt="" style="width: 110px">
                    </div>
                </div>
            </div>
            <div class="four wide column">
                <h4 class="ui inverted header m-text-bold m-text-spaced">联系我</h4>
                <div class="ui inverted link list">
                    <a class="item footer-contract"
                       th:href="'mailto:'+${myinfo.getEmail()}+'?subject='+${myinfo.getWebname()}"
                       th:text="'Email: '+${myinfo.getEmail()}"></a>
                    <a class="item footer-contract" rel="external nofollow" target="_blank"
                       th:href="'http://wpa.qq.com/msgrd?v=3&amp;uin='+${myinfo.getQq()}+'&amp;site=qq&amp;menu=yes'"
                       title="QQ" th:text="'QQ: '+${myinfo.getQq()}"></a>
                </div>
            </div>
            <div class="eight wide column">
                <h4 class="ui inverted header m-text-bold m-text-spaced">站点说明</h4>
                <p class="m-text-thin m-text-spaced m-opacity-mini" align="">本站仅作为学习交流使用，未经许可不得用于任何商业目的。
                    <br/>本站所有内容如需转载请注明出处。
                    <br/>如有不足之处，欢迎各位对本站提出宝贵的意见。</p>
            </div>
        </div>
        <div class="ui inverted section divider"></div>
        <p class="m-text-thin m-text-spaced m-opacity-tiny"
           th:text="${myinfo.getRecord()}"></p>
    </div>
</footer>
<!--底部内容结束-->
<!--返回顶部-->
<div id="toolBackTop" style="right: 56.375px;" hidden>
    <a class="sider-top" href="javascript:void (0);" title="返回顶部" onclick="gotop();return false;"></a>
</div>
<!--返回顶部结束-->

<script src="/dist/semantic/semantic.min.js"></script>
<script>
    $('.m-menu.m-toggle').click(function () {
        $('.m-item').toggleClass('m-mobile-hide');
    });
</script>

<script th:inline="javascript">
    layui.use(['form', 'layer'], function () {
        var form = layui.form
            , layer = layui.layer;
        //监听提交
    });

    function resetpwd() {
        var password = $('#password').val();
        var reg = new RegExp("^[\\S]{6,16}$"); //正则表达式
        if (!reg.test(password)) { //正则验证不通过，格式不对
            layer.msg("密码长度必须是6到16位，且不能出现空格", {icon: 2});
            return;
        }
        if ($('#passwordconf').val() !== $('#password').val()) {
            layer.msg('两次密码输入不一致', {icon: 2});
            return false;
        }
        $('#send_confirm_btn').attr("disabled", "disabled");
        $('#send_confirm_btn').addClass("layui-btn-disabled");

        var account = $('#account').val();
        var token = $('#token').val();

        $.ajax({
            //几个参数需要注意一下
            type: "POST",//方法类型
            dataType: "json",//预期服务器返回的数据类型
            url: "/user/resetpassword",//url
            data: {
                account: account,
                token: token,
                password: password,
            },
            success: function (result) {
                if (result.flag == "success") {
                    layer.confirm('修改成功,是否立即登录？', {icon: 3, title: '提示信息'}, function (index) {
                        window.location.href = "/user/login";
                    });
                } else if (result.flag == "failed_account") {
                    layer.msg("帐号信息异常", {icon: 2});
                } else if (result.flag == "failed_illagel") {
                    layer.msg("系统检测到您的操作异常，请不要酱紫😩。", {icon: 2});
                } else if (result.flag == "failed_uneffect") {
                    layer.msg("链接已经失效，请重新提交请求。", {icon: 2});
                } else {
                    layer.msg("修改密码失败，请重试！", {icon: 2});
                }

            }, error: function () {
                layer.msg("修改密码出现异常，请联系管理员！", {icon: 2});
            }
        });
    }
</script>
</body>
</html>